<template>
  <router-view></router-view>
</template>

<script>
export default {
  name: 'App',
}
</script>

<style lang="scss">
* {
  outline: none;
  box-sizing: border-box;
}
::-webkit-scrollbar {
  width: 6px;
  border-radius: 10px;
}
::-webkit-scrollbar-thumb {
  background: var(--scrollbar-bg);
  border-radius: 10px;
}
:root {
  --dark-color: #25002e;
  --hue: 288;
  --theme-bg-color: rgb(255 255 255 / 31%);
  --scrollbar-bg: rgb(1 2 3 / 40%);
  --msg-date: #c0c7d2;
  --chat-text-bg: #f1f2f6;
  --chat-text-color: #25002e;
  --theme-color: #0086ff;
  --border-color: #eef2f4;
  --body-color: #273346;
  --input-bg: #f8f8fa;

  --chat-header-bg: linear-gradient(
    to bottom,
    rgba(255, 255, 255, 1) 0%,
    rgba(255, 255, 255, 1) 78%,
    rgba(255, 255, 255, 0) 100%
  );

  --msg-hover-bg: rgba(238, 242, 244, 0.4);
  --active-conversation-bg: linear-gradient(
    to right,
    rgba(238, 242, 244, 0.4) 0%,
    rgba(238, 242, 244, 0) 100%
  );
}
html {
  box-sizing: border-box;
  -webkit-font-smoothing: antialiased;
}
body {
  color: var(--dark-color);
  margin: 0;
  background-image: url('@/assets/bg.png');
  background-size: cover;
  background-position: center;
}
</style>
